// import 'jquery'
import $ from 'jquery'
window.jQuery = window.$ = $


$('#wd').on('keyup', function (event) {
  if(event.keyCode === 13) {
    $('header button').trigger('click')
  }
})

$('header button').on('click', function () {
  const wd = $(this).prev().val()
  if (wd.trim().length === 0) {
    alert('关键词不能为空')
  } else {
    $('.loading').css({display: 'flex'})
    $.ajax({
      type: 'GET',
      url: `http://musicapi.leanapp.cn/search?keywords=${wd}`,
      success(res) {
        const {songs: list = []} = res.result
        // console.log(list)
        if (list.length === 0) {
          $('main').html(`<div class="empty">暂无数据`)
        } else {
          $('main').html(``)
          list.forEach((item) => {
            // console.log(item)
            const {artists, name, id} = item

            $(`<section>
              <span>${name}</span>
              <span>${artists[0].name}</span>
              <button data-id="${id}">▶️</button>
            </section>`).appendTo('main')
          })
        }

        $('.loading').css({display: 'none'})
      },
      error(e) {
        console.log(e)
        $('.loading').css({display: 'none'})
      }
    })
    // console.log(wd)
  }
})

$('main').on('click', 'section button', function () {
  const id = $(this).data('id')
  // /song/url?id=33894312
  // console.log(`https://music.163.com/song/media/outer/url?id=${id}.mp3`)

  $('#mp3').attr('src', `https://music.163.com/song/media/outer/url?id=${id}.mp3`)
  $('#mp3')[0].play()

  /*$.ajax({
    type: 'GET',
    url: `http://musicapi.leanapp.cn/song/url?id=${id}`,
    success(res) {
      // console.log(res.data[0].url)
      $('#mp3').attr('src', res.data[0].url)
      $('#mp3')[0].play()
    }
  })*/
})



